<template>
	<view>
		<hx-navbar ref="hxnb" :config="config" @clickBtn="clickBtn"></hx-navbar>
		<view class="layout">
			<view class="image-box">
				<u--image src="https://cdn.uviewui.com/uview/album/1.jpg" width="100%"></u--image>
			</view>
			<view class="quotation flex m-r-4">
				<u-tag text="报价" plain size="mini" borderColor="#f00" bgColor="#f00" color="#fff"></u-tag>
				<view class="bot-view red m-l-20">
					<text class="f-24">¥</text>
					<text class="f-30 font-bold p-l-4">0</text>
					<text class="f-24">/米</text>
				</view>
			</view>
			<u-gap height="5" bgColor="#eee"></u-gap>
			<view class="info-vew">
				<view class="dl-box flex">
					<view class="dt">
						{{ bottomCardVoList.comegoTypeName }}
					</view>
					<view class="dd">
						{{ bottomCardVoList.comegoName }}
					</view>
				</view>
				<view class="dl-box flex">
					<view class="dt">
						联系人
					</view>
					<view class="dd">
						散客
					</view>
				</view>
				<view class="dl-box flex">
					<view class="dt">
						职位
					</view>
					<view class="dd">
						散客
					</view>
				</view>
			</view>
			<u-gap height="7" bgColor="#eee"></u-gap>
			<view class="table-view m-t-6 m-b-20">
				<view class="th-view m-b-40">
					<view class="td-view grey">
						颜色
					</view>
					<view class="td-view grey" style="flex: 3;">
						对方叫法
					</view>
					<view class="td-view grey">
						价格
					</view>
				</view>
				<view class="tr-view">
					<view class="td-view">
						白坯#
					</view>
					<view class="td-view" style="flex: 3;">
						<view>

						</view>
					</view>
					<view class="td-view">
						<view class="inp-box">
							<text class="red m-r-10">0</text>
							<text>/米</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 底部悬浮 -->
		<view class="fixed-btn flex gap">
			<u-button text="编辑底卡" type="primary" shape="circle" @click="toAdd"
				color="linear-gradient(to right, rgb(64, 158, 255), rgb(64, 158, 255), rgb(96, 180, 246), rgb(96, 180, 246))"></u-button>
		</view>
	</view>
</template>

<script>
export default {
	props: {

	},
	data() {
		return {
			config: {
				title: "底卡详情",
				color: "#ffffff",
				//背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
				backgroundColor: [1, ["#409EFF", "#409EFF", "#60b4f6", "#60b4f6"]],
				rightButton: [
					{
						key: "btn1",
						icon: "&#xe727;",
						position: "left",
					},
				],
			},
			bottomCardVoList: {},
			// 上个页面传递过来的 当前是新增还是修改
			type: {},
		}
	},
	onLoad(option) {
		console.log("option", option);
		if (option.item) {
			this.bottomCardVoList = option.item
		}
		if (option.type) {
			this.type = option.type
		}

	},
	methods: {
		clickBtn(item) {
			// console.log("index", item);
			if (item.key === "btn1") {
				this.$Router.push({
					path: "/pages/application/pages/information/product-information/detail/components/low-calorie/add-low-calorie?type=" + encodeURIComponent(JSON.stringify({ type: 'add', index: 0 })),
				});
			}
		},
		toAdd() {
			let type = { type: 'update', index: this.type.index }
			uni.redirectTo({
				url: '/pages/application/pages/information/product-information/detail/components/low-calorie/add-low-calorie?item=' + encodeURIComponent(JSON.stringify(this.bottomCardVoList)) + '&type=' + encodeURIComponent(JSON.stringify(type)),
			});
		}
	},
	beforeDestroy() {
		uni.$emit('on-pdcl-arr', {
			type:1,
			data:this.bottomCardVoList
		})

	},
}
</script>

<style lang="scss" scoped>
.image-box {
	overflow: hidden;
}

.quotation {
	padding: 20rpx;
	background-color: #fff;
}

.info-vew {
	background-color: #fff;
	color: #666;
	font-size: 30rpx;

	.dl-box {
		padding: 30rpx 40rpx;
		border-bottom: 1rpx solid #eee;

		.dt {
			width: 100rpx;
			text-align: right;
		}

		.dd {
			padding-left: 20rpx;
			flex: 1;
		}
	}
}

.table-view {
	background-color: #fff;
	padding: 20rpx;

	.th-view,
	.tr-view {
		display: flex;
	}

	.td-view {
		flex: 1;
		display: flex;
		justify-content: center;

		.inp-box {
			display: flex;
			align-items: center;
		}
	}
}

.gap {
	border-top: 16rpx solid #eee;
}
</style>
